<template>
    <div class="sszd">
        <Row class="margin-top-10">
            <Card>
                <p slot="title" class="card-title">
                    <Row class="" :gutter="10">
                        <Col :md="4" :lg="2">
                            <div style="margin-top: 5px;">
                                <Icon type="ios-pulse"></Icon>
                                {{this.$route.meta.title}}
                            </div>
                        </Col>
                        <Col :md="20" :lg="22">
                        
                            <Form :model="formItem" label-position="left" inline>
                                <Select v-model="refvip" size="small" style="width:120px">
                                    <Option value="会员用户名" key="2">会员用户名</Option>                                        
                                    <Option value="上级代理用户名" key="1">上级代理用户名</Option>
                                </Select>
                                :
                                <Input size="small" v-model="userName" style="width: 150px" :placeholder="'请输入'+refvip"></Input>
                                <span style="margin-left: 10px;">用户类型：</span>
                                <Select v-model="formItem.group_level" size="small" style="width:100px">
                                    <Option v-for="item in groupList" :value="item.level" :key="item.level">{{ item.name }}</Option>
                                </Select>
                                <span style="margin-left: 10px;">选择日期范围：</span>
                                <DatePicker size="small"  :value="formItem.time" @on-change="setTime" type="daterange" placeholder="请输入日期范围" style="width: 200px"></DatePicker>
                                <Button type="primary"  size="small" style="margin-top: 0px;" @click="search">查询</Button>
                                <Button type="ghost"  size="small" style="margin-top: 0px;" @click="searchReset">重置</Button>
                            </Form>
                        </Col>
                    </Row>
                </span>
                <div class="line-chart-con">
                    <Table border stripe :columns="title" :data="data" ></Table>
                    <Row class="margin-top-10" :gutter="10">
                        <Col :md="12" :lg="12">
                            <Page :total="page.count" :current.sync="page.current" class-name="page-margin-top" show-elevator @on-change="pageTurn" show-sizer @on-page-size-change="listDisplayQuantity"></Page>
                        </Col>
                    </Row>
                    
                </div>
            </Card>
        </Row>
    </div>
</template>
<style lang="less">
.sszd{
    .ivu-form-item{
        margin-bottom:0px;
    }
    .ivu-card-head-inner, .ivu-card-head p{
        height: auto;
        overflow: inherit;
    }
    .page-margin-top{
        margin-top:10px;
    }
    .ivu-modal-wrap{
        display: flex;
        align-items: center;
        justify-content: center;

        .ivu-modal{
            top: 0;
        }
    }
    
}
.icon {
    width: 17px; height: 17px;
    // vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}
.icon.c{
    width: 17px; height: 17px;
    margin-left: -3px;
    margin-top: 2px;
}
</style>
<script>
import '../../styles/fonts/iconfont'

export default {
    components: {
        
    },
    data () {
        return {
            refvip:'会员用户名',
            lottery:'',
            model2: '',
            userName:'',
            gameInfo:{},
            userInfo:{},
            formItem:{
                time:["",""],
                input:'',
                group_level:'0'
            },
            groupList:[{name:'全部',level:'0'},{name:'会员',level:'-1'},{name:'代理',level:'2'}],
            is_directly:false,
            ref_id:0,
            
            page:{
                count:0,
                current:1,
                limit:'0,10'
            },
            queryData:{
                user_name:{
                    operator:'=',
                    value:''
                },
                ref_user_name:{
                    operator:'=',
                    value:''
                },
                gid:{
                    operator:'=',
                    value:''
                },
                status_code:{
                    operator:'=',
                    value:''
                },
                group_level:{
                    operator:'=',
                    value:''
                },
            },
            order_param:'id',
            cityList: [
                    {
                        value: '-1',
                        label: '未开奖'
                    },
                    {
                        value: '1',
                        label: '未中奖'
                    },
                    {
                        value: '2',
                        label: '中奖'
                    },
                    {
                        value: '3',
                        label: '撤单'
                    }
                ],
                
            data:[],
            title:[
                {
                    title:'用户名',
                    key: 'user_name',
                    align:'center',
                },
                {
                    title:'直属上级',
                    key: 'ref_user_name',
                    align:'center',
                },
                {
                    title:'银行名称',
                    key: 'bank_name',
                    align:'center',
                },
                {
                    title:'开户名',
                    key: 'bank_user_name',
                    align:'center',
                },
                {
                    title:'银行账户',
                    key: 'bank_account',
                    align:'center',
                },
                {
                    title:'创建时间',
                    key: 'created',
                    align:'center',
                },
                {
                    title:'最近操作时间',
                    key: 'updated',
                    align:'center',
                },
                {
                    title:'备注',
                    key: 'user_comment',
                    align:'center',
                },
                {
                    title:'操作',
                    key: 'ref_user_name',
                    align:'center',
                    render: (h, params) => {
                        let _this=this
                           return h('div', [
                               h('Tooltip',{
                                   props: {
                                        content: '重置资金密码',
                                        placement:'top'
                                    },
                               },[
                                    h('Button', {
                                        props: {
                                            type: 'ghost',
                                            size: 'small',
                                        },
                                        domProps: {
                                            innerHTML: `<svg class="icon c" aria-hidden="true"><use xlink:href="#icon-zhongzhimima"></use></svg>`
                                        },
                                        style: {
                                            width:'27px',
                                            height:'27px',
                                            marginRight: '2px',
                                            borderRadius: '27px'
                                        },
                                        on: {
                                            click: () => {
                                                let data={
                                                    query:{
                                                        is_directly:this.is_directly,
                                                        limit:this.page.limit,
                                                        order_param:this.order_param,
                                                        query_params:this.$oc.ocqm(this.queryData),
                                                        ref_id:this.ref_id,
                                                        time_between:`${this.formItem.time[0]},${this.formItem.time[1]}`
                                                    },
                                                    data:{
                                                        id: params.row.id,
                                                        uid: params.row.uid,
                                                        version: params.row.version,
                                                        old_pwd: "123456"
                                                    }
                                                    
                                                }
                                                this.$api.repeater(this,'setUserBankInfo',data).then(res=>{
                                                    if(res.success==true){
                                                        params.row.version+=1
                                                         _this.$Notice.success({
                                                            title: '资金密码重置成功',
                                                            desc: res.info
                                                        });
                                                    }else{
                                                        _this.$Notice.error({
                                                            title: '资金密码重置失败',
                                                            desc: res.error
                                                        });
                                                    }
                                                })
                                            }
                                        }
                                    }),
                               ])
                           ])
                    }
                },
            ]
                
            
        }
    },
    computed: {
        treeData () {
            return this.$store.state.app.tree.data
        }
    },
    watch: {  
        treeData: function(a, b) {  //a改变后的b改变前的
            this.is_directly=a.directly
            this.ref_id=a.id
            this.getsszd()
        }  
    }, 
    methods: {
        init(){
            let group = JSON.parse(sessionStorage.group)
            
            let u=JSON.parse(sessionStorage.user)
            // for(let i=0;i<group.length;i++){
            //     if(group[i].level==-1){
            //         this.groupList.push(group[i])
            //     }
            //     if(group[i].level!=-2&&group[i].level>u.user_data.User.group_level){
            //         this.groupList.push(group[i])
            //     }
            // }
            this.$store.commit('setShowTree',{show:true,dshow:false})
            // this.formItem.time=this.getNowFormatDate()
            this.gameInfo=JSON.parse(sessionStorage.gameInfo)
            this.userInfo=JSON.parse(sessionStorage.user)
            
            // this.getsszd()
            
        },
         search(){
            switch(this.refvip)
            {
                case '会员用户名':
                    this.queryData.user_name.value=this.userName
                    this.queryData.ref_user_name.value=''
                    break;
                case '上级代理用户名':
                    this.queryData.ref_user_name.value=this.userName
                    this.queryData.user_name.value=''
                    break;
            }
            this.setSearch ()
            this.getsszd ()
        },
        searchReset(){
            this.model2=''
            this.refvip='会员用户名'
            this.userName=''
            this.lottery=''
            this.formItem.time=["",""]
            this.formItem.group_level="0"
            this.setSearch ()
            this.search()
        },
        setSearch(){
            // this.queryData.group_level.value=this.formItem.group_level!=="0"?this.formItem.group_level:''
            switch (true){
                case this.formItem.group_level=='0':
                    this.queryData.group_level.value=''
                    this.queryData.group_level.operator='='
                    break;
                case this.formItem.group_level=='-1':
                    this.queryData.group_level.value=this.formItem.group_level
                    this.queryData.group_level.operator='='
                    break;
                case this.formItem.group_level=='2':
                    this.queryData.group_level.value=this.formItem.group_level
                    this.queryData.group_level.operator='>'
                    break;
            }
        },
        //翻页
        pageTurn(ev){
            let limit=this.page.limit.split(",");
            this.page.limit=`${(ev-1)*limit[1]},${limit[1]}`
            this.getsszd()
        },
        //列表显示行数
        listDisplayQuantity(ev){
            this.page.limit=`0,${ev}`
            this.getsszd()
        },
        //回到第一页
        startPage(){
            this.page.current=1
            let limit=this.page.limit.split(",");
            this.page.limit=`0,${limit[1]}`
        },
        setTime(t){
            this.formItem.time=t
        },
        getNowFormatDate () {
            let time = (data) =>{
                let date = new Date();
                if(data) date.setDate(date.getDate()+data);
                let Y = date.getFullYear()
                let M = date.getMonth() + 1;
                let D = date.getDate();
                let h = date.getHours()
                let m = date.getMinutes()
                let s = date.getSeconds()
                if (M >= 1 && M <= 9) M = "0" + M;
                if (D >= 0 && D <= 9) D = "0" + D;
                if (h >= 0 && h <= 9) h = "0" + h;
                if (m >= 0 && m <= 9) m = "0" + m;
                if (s >= 0 && s <= 9) s = "0" + s;
                return `${Y}-${M}-${D}`
            }
            return [time(-30),time(1)];
        },
        getsszd(){
            let data={
                is_directly:this.is_directly,
                limit:this.page.limit,
                order_param:this.order_param,
                query_params:this.$oc.ocqm(this.queryData),
                ref_id:this.ref_id,
                time_between:this.formItem.time[0]!==""?`${this.formItem.time[0]},${this.formItem.time[1]}`:''
            }
            this.$api.repeater(this,'getUserBankInfo',data).then(res=>{
                this.page.count=res.data.Count
                if(res.data.Records==null){
                    this.data=[]
                }else{
                    this.data=res.data.Records
                }
            })
        }
    },
    mounted (){
        this.init()
    }
};
</script>
